import { useContext, useState } from "react";
import MyContext from "./MyContext";
const MyUseContext = (props) => {
  // useContext(context对象),直接返回Provider提供的数据
  const list = useContext(MyContext) // 使用useContext()去替代普通的写法, 

  return (
    <>
      <h1>获取到外层组件提供的数据</h1>
      <ul>
        {
          list.map((el, i) => {
            return <li key={i}>{el}</li>
          })
        }
      </ul>
    </>

    // 昨天的普通写法
    // <MyContext.Consumer>
    //   {
    //     (context) => {
    //       console.log(context); // [11, 22, 44, 55, 66, 7788]
    //       return (<></>)
    //     }
    //   }
    // </MyContext.Consumer>
  )

}

export default MyUseContext;


// 思考以下怎么写的?
// function useContext(MyContext) {

// }

